<template>
    <div class="mainCenter">
        <div class="title">时间段管理</div>
        <div class="mainCenterBox">
            <div class="searchBox">
                <div class="addInfo">
                    <el-button type="primary" @click=""><el-icon>
                            <Plus />
                        </el-icon>添加时间</el-button>
                </div>
            </div>
            <el-table style="width: 100%" stripe border >
                <el-table-column label="时间段编号" prop="bookid" />
                <el-table-column prop="bookname" label="时间段编号" />
                <el-table-column prop="author" label="开始时间" />
                <el-table-column prop="typeList.type" label="结束时间" />
                <el-table-column label="备注" prop="" />
                <el-table-column  label="操作">
                    <template #default="scope">
                        <el-button type="primary" plain size="small" @click=""><el-icon>
                                <EditPen />
                            </el-icon>编辑</el-button>
                        <el-button type="danger" plain size="small" @click=""><el-icon>
                                <Delete />
                            </el-icon>删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <el-drawer v-model="isChange" :title="'图书操作'" direction="btt" size="800">
               
        </el-drawer>
    </div>
</template>

<script setup lang="ts">
import { onMounted, ref } from 'vue';


const isChange=ref<boolean>(true);

onMounted(()=>{
    isChange.value=false
})
</script>

<style scoped lang="scss">
:deep(.el-drawer) {
    border-radius: 5px;
    width: 800px;
    position: absolute;
    left: 50%;
    margin-left: -400px;
    top: 50%;
    margin-top: -400px;
    display: flex;
    justify-content: center;

}

:deep(.el-drawer__header) {
    margin-bottom: 12px;
    ;
}
:deep(.el-drawer__body){
    display: flex;
    justify-content: center;
}
</style>